//
//  ContentView.swift
//  Landmarks
//
//  Created by Hello Cai on 2020/3/26.
//  Copyright © 2020 Hello Cai. All rights reserved.
//

import SwiftUI

struct LandmarkDetail: View {
    
    @EnvironmentObject var userData: UserData
    
    var landmark: Landmark
    
    //使用 landmarkIndex 访问或更新 landmark 的收藏状态
    var landmarkIndex: Int {
        userData.landmarks.firstIndex(where: { $0.id == landmark.id })!
    }
    
    var body: some View {
        VStack {
//            MapView()
//                .edgesIgnoringSafeArea(.top)//全部往上移，刘海不留白
//                .frame(height: 300)
            MapView(coordinate: landmark.locationCoordinate)
            .edgesIgnoringSafeArea(.top)//全部往上移，刘海不留白
            .frame(height: 300)
            
            //offset设置图片居中于地图底部
            CircleImage(image: landmark.image).offset(y: -150).padding(.bottom, -150)
            
            VStack(alignment: .leading) {
                HStack {
                    Text(landmark.name)//"Trutle Rock"
                        .font(.title)
                        .foregroundColor(Color.green)
                    
                    Button(action: {
                        self.userData.landmarks[self.landmarkIndex].isFavorite.toggle()
                    }) {
                        if self.userData.landmarks[self.landmarkIndex].isFavorite {
                            Image(systemName: "star.fill")
                                .foregroundColor(Color.yellow)
                        } else {
                            Image(systemName: "star")
                            .foregroundColor(Color.gray)
                        }
                    }
                }
                HStack {
                    Text(landmark.park)//"Joshua Tree National Park"
                        .font(.subheadline)
                    Spacer()    //分割以便撑开
                    Text(landmark.state)//"California"
                        .font(.subheadline)
                }
            }
            .padding()
            
            //底部加这个，将所有内容推到屏幕顶端
            Spacer()
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        LandmarkDetail(landmark: landmarkData[0])
        .environmentObject(UserData())
    }
}
